<template>
	<view>
		<nav-bar fontColor="#FFFFFF" title="开通产品"></nav-bar>
		<view class="centerBoxtitle">开通流程</view>
		<uni-card class="margin" :is-shadow="true">
			<view style="margin: 20rpx;font-size: 35rpx;font-weight: bold;">申请额度</view>
			<uni-steps :options="list1" :active="active1" />
			<button style="float: right;margin: 20rpx;" size="mini" type="primary" disabled="true" @click="apply">已完成</button>
		</uni-card>
		<uni-card class="margin" :is-shadow="true">
			<view style="margin: 20rpx;font-size: 35rpx;font-weight: bold;">激活额度</view>
			<uni-steps :options="list2" :active="active2" />
			<button style="float: right;margin: 20rpx;" size="mini" type="primary" @click="submit">去激活</button>
		</uni-card>
		<view class="centerBoxtitle">必备资料</view>
		<view class="width">
			<view class="bottomBox">
				<view class="bottomTitle">营业执照</view>
				<view class="bottomContent">
					图片内容清晰，在有效期内至少60天。
				</view>
			</view>
			<view class="bottomBox">
				<view class="bottomTitle">法定代表人身份证</view>
				<view class="bottomContent">
					图片内容清晰，在有效期内至少60天。
				</view>
			</view>
		</view>
		<view class="width">
			<view class="bottomBox">
				<view class="bottomTitle">经办人身份证</view>
				<view class="bottomContent">
					图片内容清晰，在有效期内至少60天。
				</view>
			</view>
			<view class="bottomBox">
				<view class="bottomTitle">联系方式</view>
				<view class="bottomContent">
					企业联系电话、邮箱、法人联系电话、联系人电话
				</view>
			</view>
		</view>
		<view class="width">
			<view class="bottomBox">
				<view class="bottomTitle">对公银行账户</view>
				<view class="bottomContent">
					中国人民银行开通的基本户或...
				</view>
			</view>
			<view style="width: 47%;">
				<!-- <view class="bottomTitle">营业执照</view>
				<view class="bottomContent">
					图片内容清晰，在有效期内至少60天。
				</view> -->
			</view>
		</view>
		<!-- <uni-collapse accordion  v-model="accordionVal">
			<uni-collapse-item title="手风琴效果" >
				1
			</uni-collapse-item>
		</uni-collapse> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				active1: 3,
				accordionVal:'1',
				list1: [{
					title: '补充资料'
				}, {
					title: '签署合同'
				}, {
					title: '业务审批'
				}, {
					title: '获得额度'
				}],
				active2: 0,
				list2: [{
					title: '签署合同'
				}, {
					title: '绑定对公户'
				}, {
					title: '业务审批'
				}, {
					title: '激活额度'
				}],
				productNo: ''
			}
		},
		onLoad(e) {
			this.productNo = e.id
		},
		methods: {
			submit(){
				let opt = {
					url:'finance/customerCredit',
					method:'POST'
				};
				let params = {
					finProductNo: this.productNo,
					customerId: uni.getStorageSync('userInfo').customerId
				}
				this.$http.httpTokenRequest(opt,params).then(res =>{
					if(res.data.code == 200){
						uni.showToast({
							title: res.data.msg,
							icon:'success',
							duration: 1500
						});
						setTimeout(()=>{
							uni.navigateBack({
								delta: 3
							})
						},1500)
					}
					else{
						uni.showToast({
							title: res.data.msg,
							icon:'error',
							duration: 1500
						});
					}
				})
			}
		}
	}
</script>

<style>
	page {
		background: #f4f4f4;
	}

	.centerBoxtitle {
		font-size: 35rpx;
		color: #000000;
		font-weight: bold;
		margin: 28rpx;

	}

	.margin {
		margin: 40rpx 0;
	}
	.width{
		width: 95%;
		
		margin: 0 auto;
		margin-top: 30rpx;
		display: flex;
		justify-content: space-around;
	}
	.bottomBox{
		width: 47%;
		height: 150rpx;
		padding: 10rpx;
		border: 1px solid #e7e7e7;
		background: #FFFFFF;
		border-radius: 15rpx;
	}
	.bottomTitle{
		font-size: 28rpx;
		color: #000000;
		text-align: center;
		margin: 15rpx 0;
	}
	.bottomContent{
		font-size: 15rpx;
		color: #a5a5a5;
		text-align: center;
	}
</style>